<template>
  <view class="obtain">
    <view class="windows">
      <view class="obtainprize">已完成</view>
      <view class="commodityimg">
        <image :src="value.productImg" alt="" />
      </view>
      <view class="prizehint">
          <view class="personal">
              <view class="name">物流订单 :</view>
              <view class="phone">{{ value.expressNum }}</view>
          </view>
          <view class="location">
              <view class="gs">物流公司 :</view>
              <view>{{ value.expressType }}</view>
          </view>
      </view>
      <view class="btnok" @click="btnok">我知道了</view>
      <view class="amend" @click="amendsite">查看物流</view>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    value: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {};
  },
  created() {
    console.log();
  },
  methods: {
    amendsite() {},
    btnok() {
      this.$emit("awaitgoods");
    },
  },
};
</script>

<style lang="scss" scoped>
/*.obtain {
  position: relative;
  z-index: 5;
  width: 100vw;
  height: 100vh;
  background-color: #4c4c4c;
  overflow: hidden;
}*/
.windows {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 560rpx;
    height: 740rpx;
    color: #fff;
    // margin: 310rpx auto;
    transform: translate(-50%, -50%);
    background-color: #fff;
    border-radius: 5%;
    overflow: hidden;
    .obtainprize {
        text-align: center;
        color: #4577e8;
        font-size: 42rpx;
        margin: 70rpx 0 31rpx 0;
        font-weight: 700;
    }
    .commodityimg {
        width: 203rpx;
        height: 203rpx;
        background-color: skyblue;
        margin: 0 auto;
        image {
            width: 100%;
            height: 100%;
        }
    }
    .prizehint {
        display: flex;
        flex-direction: column;
        // background-color: pink;
        font-size: 24rpx;
        margin: 37rpx auto 37rpx 67rpx;
        color: #555555;
        .personal {
            display: flex;
            .name {
                margin-right: 15rpx;
            }
        }
        .location {
            display: flex;
            margin-top: 11rpx;
            .gs {
                margin-right: 15rpx;
            }
        }
    }
    .btnok {
        width: 478rpx;
        height: 86rpx;
        border-radius: 46rpx;
        text-align: center;
        line-height: 86rpx;
        background: url("/static/tag_ac.png") no-repeat center;
        font-size: 32rpx;
        margin: 0 auto;
    }
    .amend {
        width: 104rpx;
        height: 37rpx;
        font-size: 26rpx;
        color: #356ce7;
        margin: 37rpx auto 0 auto;

        line-height: 37rpx;
    }
}
</style>
